/****************
 *@description:  采购入库
 *@author: Xhd
 *@date: 2023-07-14 13:30:35
 *@version: V1.0.0
*************************************************************************/

import React, { Component } from 'react';
import ThePagination from "@/components/ThePagination";
import { Modal, message } from "antd";
import { ExclamationCircleOutlined } from "@ant-design/icons";
import TheTable from "@/components/TheTable";
import TheButton from "@/components/TheButton";
import { apiGetstockPurchasePage } from "@/request/procurement";
import { apiStockTakeListAddBefore } from '@/request/storageManager/stock.js';
import store from "@/store/store";
import TheQueryForm from '../../../components/TheQueryForm';
import TheTableExtend from '@/components/TheTableExtend';

export default class ProcurementList extends Component {
  constructor() {
    super()
    this.formRef_code = React.createRef()
    this.queryFormRef = React.createRef()
    this.state = {
      columns: [
        {
          title: "序号",
          dataIndex: "index",
          key: "index",
          render:(text,record,index) =>{
            return((this.state.pageData.pageNo - 1)*(this.state.pageData.pageSize) + (index + 1));
          }
        },
        {
          title: "采购单号",
          dataIndex: "code",
          key: "code",
          render: (text, render) => {
            return text
          }
        },
        {
          title: "外部单号",
          dataIndex: "code",
          key: "code",
          render: (text, render) => {
            return text
          }
        },
        {
          title: "供应商",
          dataIndex: "supplierName",
          key: "supplierName",
          render: (text, render) => {
            return text
          }
        },
        {
          title: "仓库",
          dataIndex: "libraryName",
          key: "libraryName",
          render: (text, render) => {
            return text
          }
        },
        {
          title: "采购数量",
          dataIndex: "code",
          key: "code",
          render: (text, render) => {
            return text
          }
        },
        {
          title: "创建人",
          dataIndex: "memberName",
          key: "memberName",
          render: (text, render) => {
            return text
          }
        },
        {
          title: "已收货数量",
          dataIndex: "code",
          key: "code",
          render: (text, render) => {
            return text
          }
        },
        {
          title: "创建时间",
          dataIndex: "createTime",
          key: "createTime",
          render: (text, render) => {
            return text
          }
        },
        {
          title: "订单状态",
          dataIndex: "status",
          key: "status",
          render: (text, render) => {
            let status = ""
            switch (text) {
              case 0:
                status =<div style={{color:"red"}} >未完成</div>
                break;
              case 1:
                status =<div style={{color:"orange"}} >处理中</div>
                break;
              case 2:
                status ="已完成"
                break;
              default:
                break;
            }
            return status
          }
        },
        {
          title: "操作",
          dataIndex: "serviceShowFile",
          key: "serviceShowFile",
          fixed: "right",
          render: (text, render) => {
            return <div>
              <TheButton haspermi={['procurement:warehouse:detail']}  onClick={()=>this.props.history.push('/procurement/warehouse/details/'+render.id)}>查看详情</TheButton>
            </div>
          }
        },
      ],
      dataSource: [],
      pageData: {
        pageNo: 1,
        pageSize: 10
      },
      total: 0,
      code:"",
      form_show: true,
      NewColumns: [],
      searchOption: [
        { field: 'goodsName', label: '物料名称', placeholder: '请输入', required: false, rules: [], type: 'Input', defaultValue: '' },
        { field: 'code', label: '采购单号', placeholder: '请输入', required: false, rules: [], type: 'Input', defaultValue: '' },
        { field: 'libraryId', label: '仓库', placeholder: '请选择', required: false, rules: [], type: 'Select',txt: 'name', value: 'id', options: [] },
        { field: 'supplierName', label: '供应商', placeholder: '请输入', required: false, rules: [], type: 'Input', defaultValue: '' },
        { field: 'skuNo', label: '物料ID', placeholder: '请输入', required: false, rules: [], type: 'Input', defaultValue: '' },
        { field: 'status', label: '订单状态', placeholder: '请选择', required: false, rules: [], type: 'Select', options: [{label:"处理中",value:"1"},{label:"已完成",value:"2"}] },
      ],
      queryForm: {

      },
    }
  }

  componentDidMount() {
    this.onColumnsFilter(this.state.columns)
    let searchParams = store.getState().searchValue
    if (searchParams && searchParams.pathName === "procurementWarehouse") {
      let { pageNo, pageSize, queryForm, pathName } = searchParams
      this.setState({
        queryForm,
        pageData: {
          pageNo: pageNo, pageSize: pageSize
        }
      }, () => {
        this.queryFormRef.onSetDefault({ ...queryForm })
        this.getData()
      })
    } else {
      this.getData()
    }
  }

  onColumnsFilter = (value) => {
    this.setState({
      NewColumns: value
    })
  }
  onTableRefresh() {
    this.getData()
  }

  getData = async (values)=>{
    let { pageNo, pageSize } = this.state.pageData
    this.setState({
      queryForm: values === undefined ? this.state.queryForm : { ...values }
    },async ()=>{
      const params = {
        pageNo, pageSize, queryForm: this.state.queryForm
      }
      store.dispatch({
        type: 'SaveSearchValues',
        data: {
          pathName: 'procurementWarehouse',
          ...params
        }
      })
      let res = await apiGetstockPurchasePage({
        type:1,pageNo, pageSize, ...this.state.queryForm
      })
      if(res.code === 0){
        this.setState({
          dataSource:res.data,
          total: res.totalCount,
        })
      }
    })
  }
  pageChange = (pageNo, pageSize) => {
    this.setState({
      pageData: {
        pageNo, pageSize
      }
    }, () => {
      this.getData()
    })
  };
  resetSearch() {
    this.formRef_code.current.setFieldsValue({
      code: ''
    })
    this.onFinish()
  }
  onFinish() {
    let values = this.formRef_code.current.getFieldsValue()
    console.log(values);
    this.setState({
      code: values.code
    }, () => {
      this.pageChange(1, 10)
    })
  }
  onFormSearch(values){
    this.setState({
      pageData:{pageNo:1,pageSize:10}
    },()=>{
      this.getData(values)
    })
  }
  onReset() {
    this.setState({
      queryForm: {},
      pageData: {
        pageNo: 1,
        pageSize: 10
      },
    },()=>{
      this.getData()
    })
  }
  render() {
    let { columns, dataSource, pageData, total,NewColumns,form_show, searchOption } = this.state
    return (
      <div className="p-layout-box commodity-examine">
        <TheQueryForm ref={(ref) => this.queryFormRef = ref} show={form_show} option={searchOption} onGetValues={(values) => this.onFormSearch(values)} onReset={()=>{this.onReset()}}>
        </TheQueryForm>
        <TheTableExtend
          columns={columns}
          onFormTrigger={() => this.setState({ form_show: !this.state.form_show })}
          onTableRefresh={() => this.onTableRefresh()}
          onColumnsFilter={(value) => {this.onColumnsFilter(value)}}
        >
        </TheTableExtend>
        <TheTable
          scroll={{ x: "max-content", y: '50vh' }}
          columns={columns}
          dataSource={dataSource}
        />
        <ThePagination
          pageNo={pageData.pageNo}
          pageSize={pageData.pageSize}
          total={total}
          pageChange={this.pageChange}
        />
      </div>
    );
  }
}
